<!-- 客户列表信息 -->
<template>
    <div class="head">
        <!-- 导航栏 -->
        <van-nav-bar
           title="客户列表信息"
           left-text="返回"
           right-text="新增"
           left-arrow
           @click-left="onClickLeft"
           @click-right="onClickRight"/>
        <!-- 搜索框 -->
        <form action="/">
        <van-search
          v-model="value"
          show-action
          placeholder="请输入搜索关键词"
          action-text="搜索"
          @search="onSearch"
          @cancel="onCancel"
        />
        </form>
        <!-- 列表内容 -->
        <div class="big" v-for="item in conten" :key="item.id">
            <div class="top" @click="viest(item.id)">
                <ul>
                    <li>客户名称</li>
                    <li>{{item.custName}}</li>
                </ul>
                   <ul>
                    <li>联系方式</li>
                    <li>{{item.telephone}}</li>
                </ul>
                   <ul>
                    <li>公司名称</li>
                    <li>{{item.company}}</li>
                </ul>
                   <ul>
                    <li>职务</li>
                    <li>{{item.position}}</li>
                </ul>
               
            </div>
            <div class="btm">
             <button @click="newsee">新增拜访</button>
             <button @click="vislt">拜访记录</button>
            </div>
        </div>
    </div>
</template>

<script>
import {GetCust} from '../raxios/api'
export default {
     data() {
     return {
      value: '',
      conten:[],
      mycurrent: 1,
      showMore: true,
      records: [],
      // clearable: false,
      isShow: false,
  };
},
  methods: {
    onClickLeft() {
    //   Toast('返回');
    this.$router.push('/home')
    },
    onClickRight() {
       this.$router.push('/home/Newadd')
    },
    // 搜索事件监听
     onSearch(val) {
      Toast(val);
    },
    onCancel() {
       GetCust({
        keyword: this.value,
        current: this.mycurrent,
        size: "3",
      }).then((res) => {
        if (res.errCode === 0) {
          // console.log(res);
          this.conten = res.data.records;
        }
        // this.showLoading = false;
        if (res.data.records.length !== 0) {
          this.showMore = true;
        } else {
          this.showMore = false;
          this.isShow = true;
          console.log(789);
        }
      });
    },
    vislt(){
        this.$router.push('/home/seelist')
    },
    viest(id){
        this.$router.push('/home/particulars?id='+id)
    },
    newsee(){
        this.$router.push('/home/Newsee')
    }
  },
  created(){
      GetCust({current:1,size:10}).then(res=>{
        //   console.log(res);
          this.conten=res.data.records
      })
  }
};
</script>
 
<style lang = "less" scoped>
    .head{
        width: 100%;
        height: 100%;
        background-color: #EFEFEF;
        position: fixed;
        bottom: 0;
        left: 0;
        overflow: scroll;
        z-index: 99;
        .big{
            height: 1.57rem;
            margin-top: 0.1rem;
            padding: 0.14rem 0.22rem;
            border-top: 1px solid #e5e5e5;
            border-bottom: 1px solid #e5e5e5;
            background-color: #fff;
            .top{
                height: 1.05rem;
                border-bottom: 1px dashed #bbbbbb;
                ul{
                    display: flex;
                    li:first-child{
                        color: #cdcdcd;
                        margin-right: 0.05rem;
                        /* line-height: 0.12rem; */
                        margin-bottom: 0.1rem;
                    }
               }
            }
            .btm button{
                float: right;
                color: #fff;
                padding: 0.1rem;
                margin-top: 0.15rem;
                margin-right: 0.1rem;
                border-radius: 0.5rem;
                background-color: #003399;
                border: none;
               
            }
        }
    }
        /deep/.van-nav-bar__content{
            height: 0.6rem;
            background-color: #003399;
            color: #fff;
            div{
                color: #fff;
            }
        }
        /deep/.van-nav-bar__text{
            color: #fff;
        }
        /deep/.van-icon{
            color: #fff;
        }
        /deep/.van-search__content {
            border-radius: 0.5rem;
        }

</style>